<!DOCTYPE html>
<html>
	<head>
	    <meta charset="utf-8">
	    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	    <title>运动会管理系统</title>
	    <link rel="stylesheet" href="../layui/css/layui.css">
	</head>
	<body>
		<form class="layui-form" action="">
		
		            <div class="layui-form-item">
		                <div class="layui-inline">
		                    <label class="layui-form-label">学号</label>
		                    <div class="layui-input-inline">
		                        <input type="text" name="ano" lay-verify="required"
		                               placeholder="请输入学号" autocomplete="off" class="layui-input">
		                    </div>
		                </div>
		                <div class="layui-inline">
		                    <label class="layui-form-label">项目</label>
		                    <div class="layui-input-inline">
		                        <input type="text" name="cnA" placeholder="请输入项目" autocomplete="off" class="layui-input">
		                    </div>
		                </div>
		            </div>
		            <div class="layui-form-item">
		                <div class="layui-input-block">
		                    <button class="layui-btn" lay-submit lay-filter="searchAth">搜索</button>
		                </div>
		            </div>
		        </form>
		
		    
		
		        <table class="layui-hide" id="test" lay-filter="test"></table>
		
		        
		    </div>
		
		    
		</div>
		
		
		<script src="../layui/layui.js"></script>
		
		<script>
		        layui.use(['table','layer','form'], function(){
		          var table = layui.table;
				  var layer = layui.layer;
				  var form = layui.form;
				  var searchTable = layui.layer;
				  var $ = layui.$;
		            table.render({
		            elem: '#test'
					,id: 'athlete'
		            ,url:'http://localhost:8080/calist'
		            ,cellMinWidth: 80
		            ,cols: [[
		            {field:'ano', title: '运动员编号', sort: true,align: 'center'}
		            ,{field:'an',  title: '姓名',align: 'center'}
		            ,{field:'cnoA', title: '项目编号',sort: true,align: 'center'}
		            ,{field:'cnA', title: '项目名称',align: 'center'}
		            ,{field:'score',  title: '成绩',align: 'center'}
		            ,{field:'rank',  title: '名次',align: 'center'}		            
		        ]]
		        ,page: true
				,limits: [8,10,12]
		        });
							
				//监听搜索按钮
				form.on('submit(searchAth)', function(data){
					console.log("->",data);
					table.reload('athlete', {
						 url: 'http://localhost:8080/searchAthlete'
						    ,methods:"post"						        
					        , where: data.field
					        , page: {
					          curr: 1
							  ,limit: 20
					        }
					      });
					return false;
				});
				
		    });						    										
		</script>
	</body>
</html>